<template>
    <div class="change">
        <ul>
            <li @click="changeCard()">
                <span>变更扣款账号</span>
            </li>
            <router-link :to="{path:'/change/loanway',query:{paytyp:paytyp}}" tag="li">
                <span>变更还款方式</span>
            </router-link>
            <router-link :to="{path:'/change/loantime',query:{payday:payday}}" tag="li">
                <span>变更还款日</span>
            </router-link>
            <router-link to="/change/loandeadline" tag="li">
                <span>变更还款期限</span>
            </router-link>
        </ul>
        <x-dialog v-model="show" class="dialog">
            <div class="content">
                <h3>变更需知</h3>
                <p>1.借款人本人带身份证、还款卡到零售信贷客户服务中心办理；不可代办。</p>
                <p>2.优先通过95555人工在线办理。</p>
                <p>3.处理时效：客户书面申请后3个工作日后办理完成。</p>
            </div>
            <div @click="call" class="know">
                <span class="vux-close">人工在线</span>
            </div>
            <div @click="toService()" class="know">
                <span class="vux-close">继续预约</span>
            </div>
        </x-dialog>
    </div>
</template>

<script>
import { XDialog } from "vux";
import api from "../fetch/api";
import { getStore, setStore, removeStore } from "../config/mUtils";

export default {
  components: {
    XDialog
  },
  data() {
    return {
      show: false,
      paytyp: "", //原还款类型
      payday: "" //每月还款日
    };
  },
  methods: {
    toService() {
      this.show = false;
      this.$router.push({
        path: "/select/time",
        query: { type: "ChangeCard" }
      });
    },
    call() {
      this.show = false;
      window.location.href = `tel:95555`;
    },
    changeCard() {
      this.show = true;
    }
  },
  created() {
    api.get_loan_way({ token: getStore("token") }).then(res => {
      if (res.success) {
        res.loantype.forEach((value, index) => {
          if (value.lonnbr === this.$route.query.lonnbr) {
            this.paytyp = value.paytyp;
            this.payday = value.payday;
          }
        });
        // console.log(this.paytday+'----')
      }
    });
  }
};
</script>

<style lang="less" scoped>
.change {
  margin: 1.5rem 0;
}
</style>

